<template>
  <div>
    <h3>News的子组件</h3>
    <p>姓名：{{ name }}</p>
    <p>身价：{{ price }}</p>
  </div>
</template>

<script>
export default {
  name: "Item",
  props: ["a", "b", "name", "price"],
  mounted() {
    // 查看接收的props传递的参数
    console.log(this.a, this.b, "a,b");
    console.log(this.name, this.price, "name,price");
  },

  //组件内进入时守卫
  beforeRouteEnter(to, from, next) {
    console.log("组件内进入时守卫");
    next();
  },

  // 在当前路由改变，但是该组件被复用时调用(当前组件的路由对象更新时)
  beforeRouteUpdate(to, from, next) {
    console.log("组件内更新时守卫");
    next();
  },

  //组件内离开时守卫
  beforeRouteLeave(to, from, next) {
    console.log("组件离开时守卫");
    next();
  },
};
</script>

<style></style>
